<template>
    <div style="display: flex;width: 100%;height: 100vh; background-color: black;">
        <!-- 左边 -->
        <div style="width: 50%;background-color: rgb(160, 178, 194); text-align: center;height: 99%;">
            <W网页和代码基础 :代码="代码" :访问路径="访问路径" :组件名="组件名" />
        </div>
        <!-- 右边 -->
        <div style="width: 50%;background-color: rgba(25, 8, 36, 0.521);color: aliceblue; min-height: 100%;">
            <!-- 组件名 -->
            <div style="display:flex ;">
                <h1
                    style="margin-top: 10px;margin-left: 30px;width: 180px;text-align: center;background-color:rgb(240, 20, 31);">
                    {{ 组件名 }}</h1>
                <el-button size="small" style="margin-top: 20px;margin-left: 30px;" @click="组件修改">刷新组件</el-button>
            </div>
            <div style="height: 90%;">
                <!-- 属性 -->
                <el-scrollbar height="100%">
                    <!-- 选中项绑定值 -->
                    <div :style='样式1'>
                        <h4>选中项绑定值 : </h4>
                        <spen :style='样式2'>英:v_model,类型:string / number / boolean / object / array,默认:—</spen><br>
                    </div>
                    <div style='text-align: left; margin-left: 30px;'><el-radio-group v-model='属性.v_model'
                            size='small'></el-radio-group></div>
                    <!-- 是否多选 -->
                    <div :style='样式1'>
                        <h4>是否多选 : </h4>
                        <spen :style='样式2'>英:multiple,类型:boolean,默认:FALSE</spen><br>
                    </div>
                    <div style='text-align: left; margin-left: 30px;'><el-radio-group v-model='属性.multiple' size='small'>
                            <el-radio label="true">是 </el-radio>
                            <el-radio label="false">否 </el-radio>
                            <el-radio label="">无</el-radio>
                        </el-radio-group></div>
                    <!-- 是否禁用 -->
                    <div :style='样式1'>
                        <h4>是否禁用 : </h4>
                        <spen :style='样式2'>英:disabled,类型:boolean,默认:FALSE</spen><br>
                    </div>
                    <div style='text-align: left; margin-left: 30px;'><el-radio-group v-model='属性.disabled' size='small'>
                            <el-radio label="true">是 </el-radio>
                            <el-radio label="false">否 </el-radio>
                            <el-radio label="">无</el-radio>
                        </el-radio-group></div>
                    <!-- 作为 value 唯一标识的键名，绑定值为对象类型时必填 -->
                    <div :style='样式1'>
                        <h4>作为 value 唯一标识的键名，绑定值为对象类型时必填 : </h4>
                        <spen :style='样式2'>英:value_key,类型:string,默认:value</spen><br>
                    </div>
                    <div style='text-align: left; margin-left: 30px;'><el-radio-group v-model='属性.value_key'
                            size='small'></el-radio-group></div>
                    <!-- 输入框尺寸 -->
                    <div :style='样式1'>
                        <h4>输入框尺寸 : </h4>
                        <spen :style='样式2'>英:size,类型:enum,默认:—</spen><br>
                    </div>
                    <div style='text-align: left; margin-left: 30px;'><el-radio-group v-model='属性.size' size='small'>
                            <el-radio label="large">大 </el-radio>
                            <el-radio label="default">中 </el-radio>
                            <el-radio label="small">小</el-radio>
                            <el-radio label="">无</el-radio>
                        </el-radio-group></div>
                    <!-- 是否可以清空选项 -->
                    <div :style='样式1'>
                        <h4>是否可以清空选项 : </h4>
                        <spen :style='样式2'>英:clearable,类型:boolean,默认:FALSE</spen><br>
                    </div>
                    <div style='text-align: left; margin-left: 30px;'><el-radio-group v-model='属性.clearable' size='small'>
                            <el-radio label="true">是 </el-radio>
                            <el-radio label="false">否 </el-radio>
                            <el-radio label="">无</el-radio>
                        </el-radio-group></div>
                    <!-- 多选时是否将选中值按文字的形式展示 -->
                    <div :style='样式1'>
                        <h4>多选时是否将选中值按文字的形式展示 : </h4>
                        <spen :style='样式2'>英:collapse_tags,类型:boolean,默认:FALSE</spen><br>
                    </div>
                    <div style='text-align: left; margin-left: 30px;'><el-radio-group v-model='属性.collapse_tags'
                            size='small'>
                            <el-radio label="true">是 </el-radio>
                            <el-radio label="false">否 </el-radio>
                            <el-radio label="">无</el-radio>
                        </el-radio-group></div>
                    <!-- 当鼠标悬停于折叠标签的文本时，是否显示所有选中的标签。 要使用此属性，collapse-tags属性必须设定为 true -->
                    <div :style='样式1'>
                        <h4>当鼠标悬停于折叠标签的文本时，是否显示所有选中的标签。 要使用此属性，collapse-tags属性必须设定为 true : </h4>
                        <spen :style='样式2'>英:collapse_tags_tooltip,类型:boolean,默认:FALSE</spen><br>
                    </div>
                    <div style='text-align: left; margin-left: 30px;'><el-radio-group v-model='属性.collapse_tags_tooltip'
                            size='small'>
                            <el-radio label="true">是 </el-radio>
                            <el-radio label="false">否 </el-radio>
                            <el-radio label="">无</el-radio>
                        </el-radio-group></div>
                    <!-- multiple 属性设置为 true 时，代表多选场景下用户最多可以选择的项目数， 为 0 则不限制 -->
                    <div :style='样式1'>
                        <h4>multiple 属性设置为 true 时，代表多选场景下用户最多可以选择的项目数， 为 0 则不限制 : </h4>
                        <spen :style='样式2'>英:multiple_limit,类型:number,默认:0</spen><br>
                    </div>
                    <div style='text-align: left; margin-left: 30px;'><el-radio-group v-model='属性.multiple_limit'
                            size='small'>
                            <el-radio label=5>有例子 </el-radio>
                            <el-radio label="">无</el-radio>
                        </el-radio-group></div>
                    <!-- Select 输入框的原生 name 属性 -->
                    <div :style='样式1'>
                        <h4>Select 输入框的原生 name 属性 : </h4>
                        <spen :style='样式2'>英:name,类型:string,默认:—</spen><br>
                    </div>
                    <div style='text-align: left; margin-left: 30px;'><el-radio-group v-model='属性.name'
                            size='small'></el-radio-group></div>
                    <!-- tooltip 主题，内置了 dark / light 两种 -->
                    <div :style='样式1'>
                        <h4>tooltip 主题，内置了 dark / light 两种 : </h4>
                        <spen :style='样式2'>英:effect,类型:enum / string,默认:light</spen><br>
                    </div>
                    <div style='text-align: left; margin-left: 30px;'><el-radio-group v-model='属性.effect' size='small'>
                            <el-radio label="dark">dark </el-radio>
                            <el-radio label="light">light </el-radio>
                            <el-radio label="">无</el-radio>
                        </el-radio-group></div>
                    <!-- Select 输入框的原生 autocomplete 属性 -->
                    <div :style='样式1'>
                        <h4>Select 输入框的原生 autocomplete 属性 : </h4>
                        <spen :style='样式2'>英:autocomplete,类型:string,默认:off</spen><br>
                    </div>
                    <div style='text-align: left; margin-left: 30px;'><el-radio-group v-model='属性.autocomplete'
                            size='small'></el-radio-group></div>
                    <!-- 占位符，默认为“Select” -->
                    <div :style='样式1'>
                        <h4>占位符，默认为“Select” : </h4>
                        <spen :style='样式2'>英:placeholder,类型:string,默认:—</spen><br>
                    </div>
                    <div style='text-align: left; margin-left: 30px;'><el-radio-group v-model='属性.placeholder' size='small'>
                            <el-radio label="查询">有例子 </el-radio>
                            <el-radio label="">无</el-radio>
                        </el-radio-group></div>
                    <!-- Select 组件是否可筛选 -->
                    <div :style='样式1'>
                        <h4>Select 组件是否可筛选 : </h4>
                        <spen :style='样式2'>英:filterable,类型:boolean,默认:FALSE</spen><br>
                    </div>
                    <div style='text-align: left; margin-left: 30px;'><el-radio-group v-model='属性.filterable' size='small'>
                            <el-radio label="true">是 </el-radio>
                            <el-radio label="false">否 </el-radio>
                            <el-radio label="">无</el-radio>
                        </el-radio-group></div>
                    <!-- 是否允许用户创建新条目， 只有当 filterable 设置为 true 时才会生效。 -->
                    <div :style='样式1'>
                        <h4>是否允许用户创建新条目， 只有当 filterable 设置为 true 时才会生效。 : </h4>
                        <spen :style='样式2'>英:allow_create,类型:boolean,默认:FALSE</spen><br>
                    </div>
                    <div style='text-align: left; margin-left: 30px;'><el-radio-group v-model='属性.allow_create'
                            size='small'>
                            <el-radio label="true">是 </el-radio>
                            <el-radio label="false">否 </el-radio>
                            <el-radio label="">无</el-radio>
                        </el-radio-group></div>
                    <!-- 自定义筛选方法 -->
                    <div :style='样式1'>
                        <h4>自定义筛选方法 : </h4>
                        <spen :style='样式2'>英:filter_method,类型:Function,默认:—</spen><br>
                    </div>
                    <div style='text-align: left; margin-left: 30px;'><el-radio-group v-model='属性.filter_method'
                            size='small'></el-radio-group></div>
                    <!-- 其中的选项是否从服务器远程加载 -->
                    <div :style='样式1'>
                        <h4>其中的选项是否从服务器远程加载 : </h4>
                        <spen :style='样式2'>英:remote,类型:boolean,默认:FALSE</spen><br>
                    </div>
                    <div style='text-align: left; margin-left: 30px;'><el-radio-group v-model='属性.remote'
                            size='small'></el-radio-group></div>
                    <!-- 自定义远程搜索方法 -->
                    <div :style='样式1'>
                        <h4>自定义远程搜索方法 : </h4>
                        <spen :style='样式2'>英:remote_method,类型:Function,默认:—</spen><br>
                    </div>
                    <div style='text-align: left; margin-left: 30px;'><el-radio-group v-model='属性.remote_method'
                            size='small'></el-radio-group></div>
                    <!-- 远程搜索方法显示后缀图标 -->
                    <div :style='样式1'>
                        <h4>远程搜索方法显示后缀图标 : </h4>
                        <spen :style='样式2'>英:remote_show_suffix,类型:boolean,默认:FALSE</spen><br>
                    </div>
                    <div style='text-align: left; margin-left: 30px;'><el-radio-group v-model='属性.remote_show_suffix'
                            size='small'>
                            <el-radio label="true">是 </el-radio>
                            <el-radio label="false">否 </el-radio>
                            <el-radio label="">无</el-radio>
                        </el-radio-group></div>
                    <!-- 是否正在从远程获取数据 -->
                    <div :style='样式1'>
                        <h4>是否正在从远程获取数据 : </h4>
                        <spen :style='样式2'>英:loading,类型:boolean,默认:FALSE</spen><br>
                    </div>
                    <div style='text-align: left; margin-left: 30px;'><el-radio-group v-model='属性.loading' size='small'>
                            <el-radio label="true">是 </el-radio>
                            <el-radio label="false">否 </el-radio>
                            <el-radio label="">无</el-radio>
                        </el-radio-group></div>
                    <!-- 从服务器加载数据时显示的文本，默认为“Loading” -->
                    <div :style='样式1'>
                        <h4>从服务器加载数据时显示的文本，默认为“Loading” : </h4>
                        <spen :style='样式2'>英:loading_text,类型:string,默认:—</spen><br>
                    </div>
                    <div style='text-align: left; margin-left: 30px;'><el-radio-group v-model='属性.loading_text'
                            size='small'></el-radio-group></div>
                    <!-- 搜索条件无匹配时显示的文字，也可以使用 empty 插槽设置，默认是 “No matching data'” -->
                    <div :style='样式1'>
                        <h4>搜索条件无匹配时显示的文字，也可以使用 empty 插槽设置，默认是 “No matching data'” : </h4>
                        <spen :style='样式2'>英:no_match_text,类型:string,默认:—</spen><br>
                    </div>
                    <div style='text-align: left; margin-left: 30px;'><el-radio-group v-model='属性.no_match_text'
                            size='small'></el-radio-group></div>
                    <!-- 无选项时显示的文字，也可以使用 empty 插槽设置自定义内容，默认是 “No data” -->
                    <div :style='样式1'>
                        <h4>无选项时显示的文字，也可以使用 empty 插槽设置自定义内容，默认是 “No data” : </h4>
                        <spen :style='样式2'>英:no_data_text,类型:string,默认:—</spen><br>
                    </div>
                    <div style='text-align: left; margin-left: 30px;'><el-radio-group v-model='属性.no_data_text'
                            size='small'></el-radio-group></div>
                    <!-- 选择器下拉菜单的自定义类名 -->
                    <div :style='样式1'>
                        <h4>选择器下拉菜单的自定义类名 : </h4>
                        <spen :style='样式2'>英:popper_class,类型:string,默认:''</spen><br>
                    </div>
                    <div style='text-align: left; margin-left: 30px;'><el-radio-group v-model='属性.popper_class'
                            size='small'></el-radio-group></div>
                    <!-- 当 multiple 和 filter被设置为 true 时，是否在选中一个选项后保留当前的搜索关键词 -->
                    <div :style='样式1'>
                        <h4>当 multiple 和 filter被设置为 true 时，是否在选中一个选项后保留当前的搜索关键词 : </h4>
                        <spen :style='样式2'>英:reserve_keyword,类型:boolean,默认:TRUE</spen><br>
                    </div>
                    <div style='text-align: left; margin-left: 30px;'><el-radio-group v-model='属性.reserve_keyword'
                            size='small'></el-radio-group></div>
                    <!-- 是否在输入框按下回车时，选择第一个匹配项。 需配合 filterable 或 remote 使用 -->
                    <div :style='样式1'>
                        <h4>是否在输入框按下回车时，选择第一个匹配项。 需配合 filterable 或 remote 使用 : </h4>
                        <spen :style='样式2'>英:default_first_option,类型:boolean,默认:FALSE</spen><br>
                    </div>
                    <div style='text-align: left; margin-left: 30px;'><el-radio-group v-model='属性.default_first_option'
                            size='small'>
                            <el-radio label="true">是 </el-radio>
                            <el-radio label="false">否 </el-radio>
                            <el-radio label="">无</el-radio>
                        </el-radio-group></div>
                    <!-- 是否将下拉列表插入至 body 元素 -->
                    <div :style='样式1'>
                        <h4>是否将下拉列表插入至 body 元素 : </h4>
                        <spen :style='样式2'>英:teleported,类型:boolean,默认:TRUE</spen><br>
                    </div>
                    <div style='text-align: left; margin-left: 30px;'><el-radio-group v-model='属性.teleported'
                            size='small'></el-radio-group></div>
                    <!-- 当下拉选择器未被激活并且persistent设置为false，选择器会被删除。 -->
                    <div :style='样式1'>
                        <h4>当下拉选择器未被激活并且persistent设置为false，选择器会被删除。 : </h4>
                        <spen :style='样式2'>英:persistent,类型:boolean,默认:TRUE</spen><br>
                    </div>
                    <div style='text-align: left; margin-left: 30px;'><el-radio-group v-model='属性.persistent'
                            size='small'></el-radio-group></div>
                    <!-- 对于不可搜索的 Select，是否在输入框获得焦点后自动弹出选项菜单 -->
                    <div :style='样式1'>
                        <h4>对于不可搜索的 Select，是否在输入框获得焦点后自动弹出选项菜单 : </h4>
                        <spen :style='样式2'>英:automatic_dropdown,类型:boolean,默认:FALSE</spen><br>
                    </div>
                    <div style='text-align: left; margin-left: 30px;'><el-radio-group v-model='属性.automatic_dropdown'
                            size='small'></el-radio-group></div>
                    <!-- 自定义清除图标 -->
                    <div :style='样式1'>
                        <h4>自定义清除图标 : </h4>
                        <spen :style='样式2'>英:clear_icon,类型:string / object,默认:CircleClose</spen><br>
                    </div>
                    <div style='text-align: left; margin-left: 30px;'><el-radio-group v-model='属性.clear_icon'
                            size='small'></el-radio-group></div>
                    <!-- 下拉框的宽度是否与输入框相同 -->
                    <div :style='样式1'>
                        <h4>下拉框的宽度是否与输入框相同 : </h4>
                        <spen :style='样式2'>英:fit_input_width,类型:boolean,默认:FALSE</spen><br>
                    </div>
                    <div style='text-align: left; margin-left: 30px;'><el-radio-group v-model='属性.fit_input_width'
                            size='small'>
                            <el-radio label="true">是 </el-radio>
                            <el-radio label="false">否 </el-radio>
                            <el-radio label="">无</el-radio>
                        </el-radio-group></div>
                    <!-- 自定义后缀图标组件 -->
                    <div :style='样式1'>
                        <h4>自定义后缀图标组件 : </h4>
                        <spen :style='样式2'>英:suffix_icon,类型:string / object,默认:ArrowDown</spen><br>
                    </div>
                    <div style='text-align: left; margin-left: 30px;'><el-radio-group v-model='属性.suffix_icon'
                            size='small'></el-radio-group></div>
                    <!-- 下拉菜单显示/消失时后缀图标的动画 -->
                    <div :style='样式1'>
                        <h4>下拉菜单显示/消失时后缀图标的动画 : </h4>
                        <spen :style='样式2'>英:suffix_transition,类型:boolean,默认:TRUE</spen><br>
                    </div>
                    <div style='text-align: left; margin-left: 30px;'><el-radio-group v-model='属性.suffix_transition'
                            size='small'></el-radio-group></div>
                    <!-- 标签类型 -->
                    <div :style='样式1'>
                        <h4>标签类型 : </h4>
                        <spen :style='样式2'>英:tag_type,类型:enum,默认:info</spen><br>
                    </div>
                    <div style='text-align: left; margin-left: 30px;'><el-radio-group v-model='属性.tag_type'
                            size='small'></el-radio-group></div>
                    <!-- 是否触发表单验证 -->
                    <div :style='样式1'>
                        <h4>是否触发表单验证 : </h4>
                        <spen :style='样式2'>英:validate_event,类型:boolean,默认:TRUE</spen><br>
                    </div>
                    <div style='text-align: left; margin-left: 30px;'><el-radio-group v-model='属性.validate_event'
                            size='small'></el-radio-group></div>
                    <!-- 下拉框出现的位置 -->
                    <div :style='样式1'>
                        <h4>下拉框出现的位置 : </h4>
                        <spen :style='样式2'>英:placement,类型:enum,默认:bottom-start</spen><br>
                    </div>
                    <div style='text-align: left; margin-left: 30px;'><el-radio-group v-model='属性.placement' size='small'>
                            <el-radio label="top">top </el-radio>
                            <el-radio label="top-start">top-start </el-radio>
                            <el-radio label="top-end">top-end </el-radio>
                            <el-radio label="bottom">bottom </el-radio>
                            <el-radio label="bottom-start">bottom-start </el-radio>
                            <el-radio label="bottom-end">bottom-end </el-radio>
                            <el-radio label="left">left </el-radio>
                            <el-radio label="left-start">left-start </el-radio>
                            <el-radio label="left-end">left-end </el-radio>
                            <el-radio label="right">right </el-radio>
                            <el-radio label="right-start">right-start </el-radio>
                            <el-radio label="right-end">right-end </el-radio>
                            <el-radio label="">无</el-radio>
                        </el-radio-group></div>
                    <!-- 需要显示的 Tag 的最大数量 只有当 collapse-tags 设置为 true 时才会生效。 -->
                    <div :style='样式1'>
                        <h4>需要显示的 Tag 的最大数量 只有当 collapse-tags 设置为 true 时才会生效。 : </h4>
                        <spen :style='样式2'>英:max_collapse_tags,类型:number,默认:1</spen><br>
                    </div>
                    <div style='text-align: left; margin-left: 30px;'><el-radio-group v-model='属性.max_collapse_tags'
                            size='small'></el-radio-group></div>
                    <!-- popper.js 参数 -->
                    <div :style='样式1'>
                        <h4>popper.js 参数 : </h4>
                        <spen :style='样式2'>英:popper_options,类型:objectrefer to popper.js doc,默认:{}</spen><br>
                    </div>
                    <div style='text-align: left; margin-left: 30px;'><el-radio-group v-model='属性.popper_options'
                            size='small'></el-radio-group></div>
                    <!-- 等价于原生 input aria-label 属性 -->
                    <div :style='样式1'>
                        <h4>等价于原生 input aria-label 属性 : </h4>
                        <spen :style='样式2'>英:aria_label,类型:string,默认:—</spen><br>
                    </div>
                    <div style='text-align: left; margin-left: 30px;'><el-radio-group v-model='属性.aria_label'
                      size='small'></el-radio-group></div>


                </el-scrollbar>

            </div>
        </div>

    </div>
</template>
<script setup>
import W网页和代码基础 from "../网页和代码基础.vue"
import { Delete, Edit, Search, Share, Upload } from '@element-plus/icons-vue'
import { ElMessage, formItemContextKey, ElMessageBox } from 'element-plus'
import { ref, reactive, getCurrentInstance } from 'vue'
const { proxy } = getCurrentInstance();
const 路由 = proxy.router
const 库 = proxy.lib
const API = proxy.API
const 组件名 = ref('选择器')
const 属性 = ref({
    v_model:'',//选中项绑定值
    multiple:'',//是否多选
    disabled:'',//是否禁用
    value_key:'',//作为 value 唯一标识的键名，绑定值为对象类型时必填
    size:'',//输入框尺寸
    clearable:'',//是否可以清空选项
    collapse_tags:'',//多选时是否将选中值按文字的形式展示
    collapse_tags_tooltip:'',//当鼠标悬停于折叠标签的文本时，是否显示所有选中的标签。 要使用此属性，collapse-tags属性必须设定为 true
    multiple_limit:'',//multiple 属性设置为 true 时，代表多选场景下用户最多可以选择的项目数， 为 0 则不限制
    name:'',//Select 输入框的原生 name 属性
    effect:'',//tooltip 主题，内置了 dark / light 两种
    autocomplete:'',//Select 输入框的原生 autocomplete 属性
    placeholder:'',//占位符，默认为“Select”
    filterable:'',//Select 组件是否可筛选
    allow_create:'',//是否允许用户创建新条目， 只有当 filterable 设置为 true 时才会生效。
    filter_method:'',//自定义筛选方法
    remote:'',//其中的选项是否从服务器远程加载
    remote_method:'',//自定义远程搜索方法
    remote_show_suffix:'',//远程搜索方法显示后缀图标
    loading:'',//是否正在从远程获取数据
    loading_text:'',//从服务器加载数据时显示的文本，默认为“Loading”
    no_match_text:'',//搜索条件无匹配时显示的文字，也可以使用 empty 插槽设置，默认是 “No matching data'”
    no_data_text:'',//无选项时显示的文字，也可以使用 empty 插槽设置自定义内容，默认是 “No data”
    popper_class:'',//选择器下拉菜单的自定义类名
    reserve_keyword:'',//当 multiple 和 filter被设置为 true 时，是否在选中一个选项后保留当前的搜索关键词
    default_first_option:'',//是否在输入框按下回车时，选择第一个匹配项。 需配合 filterable 或 remote 使用
    teleported:'',//是否将下拉列表插入至 body 元素
    persistent:'',//当下拉选择器未被激活并且persistent设置为false，选择器会被删除。
    automatic_dropdown:'',//对于不可搜索的 Select，是否在输入框获得焦点后自动弹出选项菜单
    clear_icon:'',//自定义清除图标
    fit_input_width:'',//下拉框的宽度是否与输入框相同
    suffix_icon:'',//自定义后缀图标组件
    suffix_transition:'',//下拉菜单显示/消失时后缀图标的动画
    tag_type:'',//标签类型
    validate_event:'',//是否触发表单验证
    placement:'',//下拉框出现的位置
    max_collapse_tags:'',//需要显示的 Tag 的最大数量 只有当 collapse-tags 设置为 true 时才会生效。
    popper_options:'',//popper.js 参数
    aria_label:'',//等价于原生 input aria-label 属性
})

const 样式1 = ref('display: flex;margin-top: 10px;margin-left: 10px;font-size: 14px;')
const 样式2 = ref('color:rgb(190, 161, 161);font-size: 10px;margin-left: 10px;')



const 代码 = ref('')
const 访问路径 = ref('http://localhost:3000/#/goselect')

const 组件修改 = async () => {
	访问路径.value = ""
    let 结果 = await API.组件修改(组件名.value, 属性.value, "", "")
    if (结果.err == 'ok') {
        代码.value = 结果.msg
        访问路径.value = 结果.url
        console.log("访问路径", 访问路径.value)
        ElMessage.success("修改成功")
    } else {
        访问路径.value = 结果.url
        ElMessage.error("错误:" + 结果.err)
    }

}

</script>
<style lang="scss"  scoped>
h4 {
    background-color: rgb(65, 104, 75);
    text-align: center;
}
</style>
